<template>
    <div class="apply">
        <x-header :left-options="{backText: ''}">申请人资料</x-header>
        <group class="apply_infos">
            <cell title="姓名" :value="users.applicant"></cell>
            <cell title="性别" :value="users.sex|formatSex"></cell>
            <cell title="身份证号码" :value="users.card_no"></cell>
        </group>
        <group>
            <cell title="工作单位" :value="users.company"></cell>
            <!-- <cell title="岗位" :value="users.job"></cell> -->
            <cell title="联系方式" :value="users.mobile"></cell>
            <cell :title="currentPart|classify" :value="users.apply_time"></cell>
            <cell title="培养人" :value="users.cultivate"></cell>
            <cell title="所属支部" :value="users.department"></cell>
        </group>
    </div>
</template>

<script>
import { XHeader, Group, Cell } from "vux";
import { mapGetters } from "vuex";
export default {
  components: {
    XHeader,
    Group,
    Cell
  },
  computed: {
    ...mapGetters(["applyInfo"])
  },
  watch: {
    applyInfo: function(Value) {
      this.users = Value;
    }
  },
  data() {
    return {
      currentPart: "",
      users: {}
    };
  },
  activated() {
    this.$store.dispatch("getApplyInfo", {
      id: this.$route.params.personid
    });
    if (this.$route.params.status === "apply") {
      this.currentPart = "apply";
    } else if (this.$route.params.status === "positive") {
      this.currentPart = "positive";
    } else if (this.$route.params.status === "prep") {
      this.currentPart = "prep";
    }
  },
  deactivated() {
    this.currentPart = "";
    this.users = {};
  },
  created() {
    this.$store.dispatch("getApplyInfo", {
      id: this.$route.params.personid
    });
    if (this.$route.params.status === "apply") {
      this.currentPart = "apply";
    } else if (this.$route.params.status === "positive") {
      this.currentPart = "positive";
    } else if (this.$route.params.status === "prep") {
      this.currentPart = "prep";
    }
  },
  filters: {
    classify: function(val) {
      if (val === "apply") {
        return "递交申请书时间";
      } else if (val === "positive") {
        return "确定为积极分子时间";
      } else if (val === "prep") {
        return "确定为预备党员时间";
      }
    },
    formatSex: function(val) {
      if (val === 0) {
        return "男";
      } else if (val === 1) {
        return "女";
      }
    }
  }
};
</script>

<style lang="less">
.apply {
  width: 100%;
  min-height: 100%;
  font-size: 0;
  background: rgb(245, 245, 249);
  .apply_infos {
    padding: 2.875rem 0 0;
  }
  .weui-cell {
    padding: 0.75rem 1.125rem 0.75rem 0.8125rem;
  }
  .vux-label {
    font-size: 1.125rem;
  }
  .weui-cell__ft {
    font-size: 0.8125rem;
    color: rgb(102, 102, 102);
  }
}
</style>